<template>
    <div id="home">
        <div class="home-left">
            <MyApp></MyApp>
        </div>
        <div class="home-right">
            <Activity></Activity>
        </div>
    </div>
</template>
<script>
    import request from "@/lib/request";
    import helper from "@/lib/helper";
    import Profile from "@/pages/Profile";
    import Activity from "@/pages/Activity";
    import MyApp from "@/pages/MyApp";
    export
        default {
            components: {
                Activity, Profile, MyApp
            },
            data() {
                return {
                    userInfo: false,
                }
            },
            created() {
                this.userInfo = helper.getUserInfo();
            },
            methods: {

            }
        }
</script>
<style>
    .home-left {
        width: 300px;
        position: relative;
        overflow: hidden;
        overflow-y: auto;
        background: var(--card-bg-color);
        margin-right: 2px;
        display: flex;
        flex-direction: column;
        border-right: 5px solid var(--bg-color);
    }

    .home-right {
        flex-grow: 1;
        width: 0;
        position: relative;
        overflow: hidden;
        background: var(--card-bg-color);
        display: flex;
    }
</style>